<template>
    <!-- <button style="position:absolute;bottom:50px;left:0px;background-color: aqua;" @click="open"></button> -->
    <div class="DemBlendPage" v-if="ExamComponent.Default.openPop.value">
        <div class="header">
            <span>{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Title }}</span>
            <span class="close" @click="close">×</span>
        </div>
        <div class="crollStyle">
            <div class="substance">
            <!-- 标定要求 -->
                <div class="Task">
                     <div class="title">
                        <img class="titPic" src="/public/static/Exam/标定要求icon.png">
                        <!-- <p>{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Task.Title }}</p> -->
                        <p>标定方案</p>
                     </div>
                     <div class="taskName" style="margin-top: 2.8rem;margin-left: 13.5rem;"><span>1.{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Task.Content[1].Task }}</span></div>
                     <div class="taskName" style="margin-top: 2.8rem;margin-left: 4.9rem;"><span>2.{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Task.Content[2].Task }}</span></div>
                     <div class="taskName" style="margin-top: 3.8rem;margin-left: 13.5rem;"><span>3.{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Task.Content[3].Task }}</span></div>
                     <div class="taskName" style="margin-top: 3.8rem;margin-left: 4.9rem;"><span>4.{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Task.Content[4].Task }}</span></div>
                </div>
            <!-- 空间位置坐标 -->
                <div class="coordinates">
                     <div class="title">
                        <img class="coordTitPic" src="/public/static/Exam/空间位置坐标.png">
                        <text>{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Title }}（以下坐标是以世界坐标为原点的相对坐标位置，世界坐标系设定为车辆坐标系，用于传感器坐标标定，姿态标定需参考各传感器坐标系）</text>
                     </div>
                     <div class="content">
                        <div class="spatialOrigin">
                            <div class="tlt">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[1].Title }}</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>X</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[1].Positon }}</div></div>
                                <div class="coord_xyz"><span>Y</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[2].Positon }}</div></div>
                                <div class="coord_xyz"><span>Z</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[3].Positon }}</div></div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[4].Title }}</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>X</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[4].Positon }}</div></div>
                                <div class="coord_xyz"><span>Y</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[5].Positon }}</div></div>
                                <div class="coord_xyz"><span>Z</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[6].Positon }}</div></div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[7].Title }}</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>X</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[7].Positon }}</div></div>
                                <div class="coord_xyz"><span>Y</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[8].Positon }}</div></div>
                                <div class="coord_xyz"><span>Z</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[9].Positon }}</div></div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[10].Title }}</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>X</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[10].Positon }}</div></div>
                                <div class="coord_xyz"><span>Y</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[11].Positon }}</div></div>
                                <div class="coord_xyz"><span>Z</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[12].Positon }}</div></div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[13].Title }}</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>X</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[13].Positon }}</div></div>
                                <div class="coord_xyz"><span>Y</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[14].Positon }}</div></div>
                                <div class="coord_xyz"><span>Z</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[15].Positon }}</div></div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[16].Title }}</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>X</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[16].Positon }}</div></div>
                                <div class="coord_xyz"><span>Y</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[17].Positon }}</div></div>
                                <div class="coord_xyz"><span>Z</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[18].Positon }}</div></div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[19].Title }}</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>X</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[19].Positon }}</div></div>
                                <div class="coord_xyz"><span>Y</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[20].Positon }}</div></div>
                                <div class="coord_xyz"><span>Z</span><div class="coordDiv">{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content[21].Positon }}</div></div>
                            </div>
                        </div>
                     </div>
                </div>
            <!-- 组合导航标定 -->
                <div class="CoordinatesBox">
                    <div class="title">
                       <img class="titPic" src="/public/static/Exam/标定要求icon.png">
                       <text>{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Title }}</text>
                    </div>
                    <div class="content">
                        <div class="spatialOrigin">
                            <div class="tlt">姿态标定(0.000°)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Rx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[1].Value" 
                                :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[1].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[1].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Ry</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[2].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[2].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Rz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[3].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[3].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">坐标标定(0.000m)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Tx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[1].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[0] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[1].Value != FusionCalibrationComponent.Default.coordAnswer.value[0] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[0] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                                <div class="coord_xyz"><span>Ty</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[1] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[1] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[2].Value != FusionCalibrationComponent.Default.coordAnswer.value[1] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Tz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[2] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[2] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[1].Coord[3].Value != FusionCalibrationComponent.Default.coordAnswer.value[2] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 激光雷达标定 -->
                <div class="CoordinatesBox">
                    <div class="title">
                       <img class="titPic" src="/public/static/Exam/标定要求icon.png">
                       <text>{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Title }}</text>
                    </div>
                    <div class="content">
                        <div class="spatialOrigin">
                            <div class="tlt">姿态标定(0.000°)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Rx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[1].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[1].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[1].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Ry</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[2].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[2].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Rz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[3].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[3].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">坐标标定(0.000m)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Tx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[1].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[3] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[1].Value != FusionCalibrationComponent.Default.coordAnswer.value[3] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[3] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                                <div class="coord_xyz"><span>Ty</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[4] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[2].Value != FusionCalibrationComponent.Default.coordAnswer.value[4] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[4] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                                <div class="coord_xyz"><span>Tz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[5] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[3].Value != FusionCalibrationComponent.Default.coordAnswer.value[5] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[2].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[5] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 毫米波雷达标定 -->
                <div class="CoordinatesBox">
                    <div class="title">
                       <img class="titPic" src="/public/static/Exam/标定要求icon.png">
                       <text>{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Title }}</text>
                    </div>
                    <div class="content">
                        <div class="spatialOrigin">
                            <div class="tlt">姿态标定(0.000°)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Rx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[1].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[1].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[1].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Ry</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[2].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[2].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Rz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[3].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[3].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">坐标标定(0.000m)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Tx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[1].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[6] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[1].Value != FusionCalibrationComponent.Default.coordAnswer.value[6] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[6] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                                <div class="coord_xyz"><span>Ty</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[7] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[2].Value != FusionCalibrationComponent.Default.coordAnswer.value[7] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[7] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                                <div class="coord_xyz"><span>Tz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[8] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[3].Value != FusionCalibrationComponent.Default.coordAnswer.value[8] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[3].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[8] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 双目相机标定 -->
                <div class="CoordinatesBox">
                    <div class="title">
                       <img class="titPic" src="/public/static/Exam/标定要求icon.png">
                       <text>{{ FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Title }}</text>
                    </div>
                    <div class="content">
                        <div class="spatialOrigin">
                            <div class="tlt">姿态标定(0.000°)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Rx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[1].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[1].Answer ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[1].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[1].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[1].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Ry</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[2].Answer && isDemarcate ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[2].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[2].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[2].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                                <div class="coord_xyz"><span>Rz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[3].Answer && isDemarcate ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[3].Value == FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[3].Value != FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Posture[3].Answer && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                </div>
                            </div>
                        </div>
                        <div class="spatialOrigin">
                            <div class="tlt">坐标标定(0.000m)</div>
                            <div class="coord">
                                <div class="coord_xyz"><span>Tx</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[1].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[9] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[1].Value != FusionCalibrationComponent.Default.coordAnswer.value[9] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[1].Value == FusionCalibrationComponent.Default.coordAnswer.value[9] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                                <div class="coord_xyz"><span>Ty</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[2].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[10] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[2].Value != FusionCalibrationComponent.Default.coordAnswer.value[10] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[2].Value == FusionCalibrationComponent.Default.coordAnswer.value[10] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                                <div class="coord_xyz"><span>Tz</span><input v-model="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[3].Value"
                                    :class="isDemarcate && !ExamComponent.Default.RegulationGame.value ? FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[11] ? 'coordDivRight' : 'coordDivWrong' : 'coordDiv'" @keyup="changeValue"/>
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[3].Value != FusionCalibrationComponent.Default.coordAnswer.value[11] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/错误.png">
                                    <img v-if="FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration[4].Coord[3].Value == FusionCalibrationComponent.Default.coordAnswer.value[11] && isDemarcate && !ExamComponent.Default.RegulationGame.value" src="/public/static/Exam/融合标定/正确.png">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="confirmStandardization" @click="confrimStand">标定</div>
            <div v-if="FusionCalibrationComponent.Default.HiddenDomain.value" style="opacity: 0;">heishou</div>
        </div>
    </div>
</template>

<script setup  lang="ts">
import { onMounted, ref } from "vue" 
import ExtractData from "./ExtractData";
import FusionCalibrationComponent from "./FusionCalibrationComponent";
import ExamComponent from './ExamComponent';
import { ElMessage } from 'element-plus'
import 'element-plus/dist/index.css'
const isDemarcate = ref(false)
const provOperation = ref<any>([])
const coordAnswer = ref<any>([])
function changeValue() {
    FusionCalibrationComponent.Default.HiddenDomain.value = !FusionCalibrationComponent.Default.HiddenDomain.value
}
function confrimStand() {
    console.log('点击标定',FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration);
    FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration.forEach((element:any) => {
        if(element.Title != '') {
            element.Coord.forEach((coord:any) => {
                if(coord == '{}' || coord.Value == undefined) {
                    return
                } else {  
                    // console.log('coord.Answer',coord.Answer);
                    
                    // coordAnswer.value.push(FusionCalibrationComponent.Default.calculateCoord(coord.Answer))
                    // console.log(coord.Value,'===???',FusionCalibrationComponent.Default.calculateCoord(coord.Answer),coord.Value != FusionCalibrationComponent.Default.calculateCoord(coord.Answer));     
                    if(coord.Value == undefined || coord.Value != FusionCalibrationComponent.Default.calculateCoord(coord.Answer)) {        
                        provOperation.value.push(0)  
                    }else {
                        provOperation.value.push(1)
                    }
                }
            });
            element.Posture.forEach((posture:any) => {
                if(posture == '{}' || posture.Value == undefined) {
                    return
                } else {
                    // console.log(posture.Value,'=?',parseFloat(posture.Answer).toFixed(3),posture.Value != parseFloat(posture.Answer).toFixed(3));
                    // if(posture.Value == undefined || posture.Value != parseFloat(posture.Answer).toFixed(3)) {
                    // console.log(posture.Value,'=?',posture.Answer,posture.Value != posture.Answer);
                    if(posture.Value == undefined || posture.Value != posture.Answer) {
                        provOperation.value.push(0)
                    }else {
                        provOperation.value.push(1)
                    }
                }
            });
        }
    });
    // console.log('坐标标定答案',coordAnswer.value);
    // console.log('provOperation.value', provOperation.value);
    if(!ExamComponent.Default.RegulationGame.value) {
        if(provOperation.value.includes(0)) {
            ElMessage({
                message: '标定失败',
                type: 'error',
            })
        } else {
            ElMessage({
                message: '标定成功',
                type: 'success',
            })
        }
    } else {
        ElMessage({
            message: '标定完成',
            type: 'success',
        })
    }

    FusionCalibrationComponent.Default.Calibration(FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Calibration)
    FusionCalibrationComponent.Default.Appraise()
    isDemarcate.value = true
    // ExamComponent.Default.openPop.value = false  
    provOperation.value = []
    // FusionCalibrationComponent.Default.coordAnswer.value = [] 
    // console.log('点击标定后',provOperation.value,coordAnswer.value);
    
}
function close() {
    ExamComponent.Default.openPop.value = false
}

onMounted(() => {
    FusionCalibrationComponent.Default.Get()
    console.log('FusionCalibrationComponent.Default.fusionCalibrationConfigModel',FusionCalibrationComponent.Default.fusionCalibrationConfigModel);
    FusionCalibrationComponent.Default.fusionCalibrationConfigModel.Coord.Content.forEach((element:any) => {
        element.Positon = parseFloat(element.Positon).toFixed(3)
    });
    // console.log('坐标标定答案',FusionCalibrationComponent.Default.coordAnswer.value);
    
})
</script>

<style scoped>
.DemBlendPage {
    width: 124rem;
    height: 80rem;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 2rem;
    border: solid 0.6rem transparent;
    background-image: linear-gradient(#131620, #131620),
        linear-gradient(90deg, #218cde, #807de1);
    background-origin: border-box;
    background-clip: content-box, border-box;
    overflow-y: hidden;
}
.crollStyle {
    width: 122rem;
    height: 69rem;
    overflow: overlay;
}
.crollStyle::-webkit-scrollbar {
    /*滚动条整体样式*/
    width: 0.6rem;
    /*高宽分别对应横竖滚动条的尺寸*/
    height: 0.1rem;
}

.crollStyle::-webkit-scrollbar-thumb {
    /*滚动条里面小方块*/

    border-radius: 1rem;
    background: #81859C;
}

.crollStyle::-webkit-scrollbar-track {
    /*滚动条里面轨道*/
    border-radius: 1rem;
    background: #191c25;
}
.substance {
    width: 120.5rem;
}
.header {
    width: 100%;

    padding: 2rem;

    display: flex;
    justify-content: space-between;
    align-items: center;
}
.header>span {
    color: white;
    font-size: 2.4rem;
    font-weight: 500;
}
.close {
    color: #81859C;
    font-size: 2rem;
}
.Task {
    width: 118rem;
    height: 23.2rem;
    background: rgba(129,133,156,0);
    border-radius: 2rem;
    color: #80a2d3;
    background-color: #10131b;
    margin-left: 2.5rem;
}
.title {
    display: flex;
    width: 112rem;
    height: 5.5rem;
    border-bottom: 0.1rem solid #152233;
    margin-left: 3rem;
    line-height: 5.5rem;
    color: #fff;
    font-size: 1.6rem;
}
.titPic {
   width: 2.6rem;
   height: 2.6rem;
   margin-top: 1.5rem;
   margin-right: 1.3rem; 
}
.taskName {
    display: inline-block;
    width: 41.4rem;
    height: 4.7rem;
    line-height: 4.7rem;
    background-image: url('/public/static/Exam/1.png');
    background-repeat: no-repeat;
    background-size: cover; 
    padding-left: 9rem;
    font-size: 1.4rem;
}
.coordinates {
    width: 118rem;
    height: 54rem;
    border-radius: 2rem;
    background-color: #10131b;
    margin-left: 2.5rem;
    margin-top: 2.8rem;
}
.coordTitPic {
    width: 1.7rem;
    height: 2.7rem;
    margin-top: 1.5rem;
    margin-right: 1.3rem;
}
.content {
    width: 113rem;
    margin-left: 3rem;
    margin-top: 2.8rem;
    font-size: 1.6rem;
    color: #81859C;
}
.spatialOrigin {
    display:flex;
    height: 3rem;
    line-height: 3rem;
    margin-bottom: 2.7rem;
}
.tlt {
    width: 15rem;
    height: 3rem;
    line-height: 3rem;
}
.coord {
    width: 98rem;
    display: flex;
    justify-content: space-between;
}
.coord_xyz {
    display: flex;
}
.coord_xyz > span {
    margin-right: 0.4rem;
}
.coordDiv {
    width: 26.5rem;
    border: 0.1rem solid #1e2239;
    border-radius: 0.3rem;
    text-align: center;
}
.coordDivRight {
    width: 26.5rem;
    border: 0.1rem solid #218CDE;
    border-radius: 0.3rem;
    text-align: center;
}
.coordDivWrong {
    width: 26.5rem;
    border: 0.1rem solid #D0021B;
    border-radius: 0.3rem;
    text-align: center;
}
.coord_xyz > img {
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0.8rem;
    margin-left: 0.5rem;
}
.CoordinatesBox {
    width: 118rem;
    height: 20rem;
    border-radius: 2rem;
    background-color: #10131b;
    margin-left: 2.5rem;
    margin-top: 2.8rem;
}
.coordPic {
    width: 2.6rem;
    height: 2.7rem;
    margin-top: 1.5rem;
    margin-right: 1.3rem;
}
.confirmStandardization {
    width: 19.8rem;
    height: 7.5rem;
    font-weight: 500;
    font-size: 2.4rem;
    color: #FFFFFF;
    line-height: 8.5rem;
    text-align: center;
    background-image: url('/public/static/Exam/btn-bg.png');
    background-repeat: no-repeat;
    background-size: cover; 
    letter-spacing: 1.5rem;
    margin-top: 3.5rem;
    margin-bottom: 3.1rem;
    margin-left: 51rem
}
input {
    outline: 0;
    text-align: center;
    color: #6c6f84;
    padding: 0 1rem;  
}
</style>